<template>
  <view class="main-container">
		<!--  头部搜索栏 -->
<!-- 		<view class="head">
			<view class="search_view">
				<input class="search" v-model="keyword" placeholder="请输入关键字搜索" />
<!-- 				<button size="mini" @click="searchPolicy()"></button> -->
				<!-- <image src="http://113.142.144.25:9301/statics/appimg/icon_search_btn_new.png" 
					style="height: 30rpx;width:30rpx;padding: 20rpx;" @click="searchPolicy()"></image>
			</view>
		</view> --> 
		<!--导航栏-->
		<!-- <orderTabBar :tabList="tabList" @clickTabBar="clickTabBar" class="tab-bar" :show-line="true" /> -->
		<!--订单列表-->
		<scroll-view class="policy_list" scroll-y="true" :style="'height:100vh'" enable-flex  @scrolltolower="scrollToLower()">
			<!-- 服务机构 -->
			<view>
				<view class="new_machine_item">
					<uni-grid :column="2" :showBorder="false">
						<block v-for="(item,index) in dataList" :key="index">
							<uni-grid-item style="height:420rpx;">
								<view  @click="machineDetail(dataList[index])"
									class="view_item_right">
									<image :src="item.logoImg" style="width: 80%;height: 200rpx;margin-top: 35rpx;"></image>
									<view class="machine_info" >
										<view >
											<text class="machine_lable">名称：{{item.realName?item.realName:'暂无'}}</text>
											<view>
												<text class="machine_lable">法人：{{item.legalPerson?item.legalPerson:'暂无'}}</text>
											</view>
											<view>
												<text class="machine_lable">联系方式：{{item.contact?item.contact:'暂无'}}</text>
											</view>
										</view>
									</view>
								</view>
							</uni-grid-item>
						</block>
					</uni-grid>
				</view>
			</view>

		    <view class="no-data" v-if="dataList.length == 0">
			    <!-- <image src="https://file.genepre.com/wechat/nomsg5_new.png" mode="aspectFit" class="no-data-img"></image> -->
			   暂无数据
		    </view>
		</scroll-view>
	  </view>
</template>

<script>
	import orderTabBar from '@/wxcomponents/tab_bar.vue';
	import * as zjfw from '@/api/service/zjfw/zjfw.js'
	import env from '../../../utils/env';
	import uniGrid from "@/components/uni-grid/components/uni-grid/uni-grid.vue";
	import * as findData from "@/api/finddata.js"
	
	import uniGridItem from "@/components/uni-grid/components/uni-grid-item/uni-grid-item.vue"
	export default {
	  components: {
		orderTabBar,
		uniGrid,
		uniGridItem
	  },
	  data() {
		return {
		  showPage: false,
		  // 订单列表tab项
		  tabList: [{
			status: '0',
			title: '服务机构'
		  },
		  {
		  	status: '1',
		  	title: '服务人员'
		  },
			{
			  status: '2',
			  title: '服务内容'
			},
		  ],
		  // 当前选择tab项
		  currentIndex: 0,
		  // 当前查询状态
		  currentStatus: '',
		  // 订单列表高度
		  orderHeight: 0,
		  // 是否还有更多数据
		  noMoreData: {},
		  // 订单列表
		  dataList: [],
		  query:{
			// 页码数组
			pageNum: 1,
			// 每页请求数
			pageSize: 10,  
		  },
		  policylevel:'',
		  keyword:'',
		  total:0
		}
	  },
	  mounted() {
		// let _this = this;
		// const query = uni.createSelectorQuery().in(this);
		// query.select('.tab-bar').boundingClientRect(data => {
		//   _this.tabHeight = data.height
		//   _this.orderHeight = _this.windowHeight-5
		// }).exec();
		this.getdataList()
	  },
	  methods: {
		// tab切换
		clickTabBar(index, status) {
		  this.currentIndex = index
		  this.currentStatus = status
		  this.dataList = [];
		  this.getdataList()
		},
		// 加载订单列表
		getdataList() {
			uni.showLoading({});
			const data = {
				policylevel:this.currentStatus,
				pageNum: this.pageNum,
				pageSize: this.pageSize,
				code: "KJZC",
			};
			if(this.currentIndex == 0){
				zjfw.getZjList(this.query).then((res)=>{
					res.rows.forEach(v => {
						v.logoImg = `${env.imgUrl}` + v.logoImg 
						this.dataList.push(v)
					})
					this.total = res.total
					console.log(this.dataList)
					uni.hideLoading();
				});
			}else if(this.currentIndex == 1){
				zjfw.getZjList(this.query).then((res)=>{
					res.rows.forEach(v => {
						v.logoImg = `${env.imgUrl}` + v.logoImg 
						this.dataList.push(v)
					})
					this.total = res.total
					uni.hideLoading();
				});
			}
		},
		// 更新order
		updateOrderInfo(index) {
			let _this = this
			_this.getdataList()
		},
		// 滑到底部 加载更多
		scrollToLower() {
			if(this.dataList.length<this.total){
				this.query.pageNum = this.query.pageNum + 1;
				this.getdataList();
			}else{
				uni.showToast({
					icon:'none',
					title:"没有更多数据"
				})
			}
		},
		machineDetail(item){
			uni.navigateTo({
				url:'/subpages/pages/detail/between_detail?id='+ item.id
			})
		},
		searchPolicy(){
			const data = {
				pageNum: this.pageNum,
				pageSize: this.pageSize,
				searchvalue:this.keyword
			};
			findData.getmemberServer(data).then((res)=>{
				this.dataList = res.rows
			})
		},
	  },
	  computed: {
			
	  }
	}
</script>

<style>
	.main-container {
		width: 100vw;
		height: fit-content;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background-color: #e6e6e6;
	}
	
	.main-container .tab-bar {
		width: 93%;
		border-radius: 15rpx;
	}
	
	.main-container .order-lists {
		width: 100%;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
	}
	
	.head {
		display: flex;
		width: 93vw;
		margin: 20rpx auto;
		height: 70rpx;
		border-radius: 30rpx;
		background-color: #fff;
		text-align: center;
	}
	
	.search_view{
		margin: 0 auto;
	}
	
	.search {
		height: 40rpx;
		padding-top: 15rpx;
		font-size: 25rpx;
		float: left;
	}
	
	.no-data {
		width: 100%;
		height: 300rpx;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		font-size: 32rpx;
		margin-top: 100rpx;
	}
	
	.no-data .no-data-img {
		width: 300rpx;
		height: 268rpx;
	}
	
	.policy_list {
		width: 100%;
		height: fit-content;
		border-radius: 15rpx;
		margin-top: 20rpx;
	}
	
	.policy_item {
		height: 80rpx;
		background-color: #fff;
	}
	
	.policy_title {
		display: -webkit-box;
		margin-top: 50rpx;
		font-size: 30rpx;
		overflow: hidden;
		white-space: nowrap;
		text-overflow:ellipsis;
		-webkit-box-orient: vertical; /*排列方式*/ 
		-webkit-line-clamp: 1; /*显示文本行数(这里控制多少行隐藏)*/
	}
	
	.publicTime {
		float:left;
		font-size: 26rpx;
		color: #a1a1a1;
		margin-top: 15rpx;
	}
	
	.devideline {
		float: left; 
		height: 0.3rpx;
		width:100%;
		background-color: #eeeeee;
		margin-top: 15rpx;
		margin-bottom: 15rpx;
	}
	
	.new_machine_item{
		height: 400rpx;
		width: 100%;
		padding-left: 15rpx;
		float: left;
	}
	
	.view_item_right{
		height:400rpx;
		width: 89%;
		font-size: 35rpx;
		color: #fff;
/* 		border: #016fb8 1px solid; */
		border-radius: 15rpx;
		text-align: center;
		background-color: #fff;
	/* 	float: left; */
	}
	
	.machine_lable{
		display: -webkit-box;
		color: #000000;
		font-size: 24rpx;
		line-height: 40rpx;
		text-align: left;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 1;
		-webkit-box-orient: vertical;
	}
	
	.machine_info {
		margin: 20rpx 15rpx 20rpx 15rpx;
	}
	
	/deep/ .uni-view{
		height: 200rpx;
	}
	
	/deep/ .uni-grid-item{
		height: 220rpx;
	}
</style>